<template>	
	<view class="auto_play_wrapper">
		<view class="auto_wrap" v-if="swiperList.length > 0">
			<u-swiper class="my_swipe" :list="swiperList" keyName="src" indicatorMode="dot" radius="0" imgMode="aspectFit" height="200" indicator circular @click="JumpPage"></u-swiper>
		</view>
		<view class="default_message" v-else>
			<view class="title">轮播图广告组件</view>
			<view class="tip">(推荐750*280px的一组等比例图片)</view>
		</view>
	</view>
</template>

<script>
  export default {
    props: ["lunbotu","prevent"],
	data(){
		return {
			swiperList: []
		}
	},
	created(){
		this.init();		
	},
	methods:{
		init(){	// 页面初始化
			this.swiperList = this.$props.lunbotu;
		},	
		JumpPage(i){	// 跳转页面
			console.log(i,this.swiperList[i])	
		}
	},
	
  }
</script>

<style lang="scss" scoped>
.auto_play_wrapper{
	.auto_wrap{
		.my_swipe{
			
		}
	}
	.default_message{
		width: 100%;
		padding: 50px 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		text-align: center;
		.title{
			width: 100%;
			font-size: 18px;
			line-height: 36px;
			color: #333;
		}
		.tip{
			width: 100%;
			font-size: 14px;
			line-height: 20px;
			color: #ccc;
		}
	}
}	
	
	
	/*
	.customtext {
		margin: 0 auto;
		background: #eee;
		width: 100%;
		height: 100px;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size:10px;
		flex-direction: column;
	  text{
		  font-size: 12px;
		  flex:1;
		  line-height: 50px;
	  }
	}
	 .my-swipe .van-swipe-item {
	    color: #fff;
	    font-size: 20px;
	    text-align: center;
	    //line-height: 150px;
	    //background-color: #39a9ed;
	  }
	  */
</style>
